<template>
	<image src="../../static/image/09.png" mode="widthFix" class="bg"></image>
	<u-navbar
	title="师傅详情"
	:autoBack="true"
	:background="{
	background:'transparent'
	}"
	:border-bottom="false"
	titleSize="28rpx" titleColor="#fff"
	back-icon-color="#fff"
	:isFixed="false"
	/>
	
	<view class="" v-if="data">
		<view class="container pl30 pr30">
			<worker :comment="true" :data='data'></worker>
			<view class="line"></view>
			<view class="t-flex between tag" @click="$go('/pages/authentication/authentication?id='+data.user_id)">
				<view class="t-flex t-flex between">
					<image src="../../static/image/10.png" mode="aspectFit" class="icon mr20"></image>
					<view class="">
						平台认证
					</view>
				</view>
				<i class="iconfont icon-xiangyou1"></i>
			</view>
		</view>
		
		
		
		<view class="Allbottom t-flex center safeArea" >
			<needLogin  @onClick="$go('/pages/createOrder/forWorker?id='+data.user_id)">
				<view class="btn t-flex center cf f30">立即预约</view>
			</needLogin>
		</view>
	</view>
	<loading v-else></loading>

</template>

<script setup lang="ts">
	import { onLoad,onShareTimeline,onShareAppMessage } from "@dcloudio/uni-app"
	import { ref } from "vue";
	import { workerDetail } from "../../api";
	import { useStore } from "../../store";
	
	const store = useStore()
	
	onLoad(options=>{
		getdata(options.id)
	})
	onShareAppMessage(()=>{
		let sf_pid = 0
		let xy_pid = 0
		if(store.userinfo){
			sf_pid = store.userinfo.is_sf==1?store.userinfo.id:0
			xy_pid = store.userinfo.is_sf==1?0:store.userinfo.id
		}		
		return {
			title:data.value.name,
			path:`/pages/worker/detail?id=${data.value.id}&sf_pid=${sf_pid}&xy_pid=${xy_pid}`
		}
	})
	onShareTimeline(()=>{
		let sf_pid = 0
		let xy_pid = 0
		if(store.userinfo){
			sf_pid = store.userinfo.is_sf==1?store.userinfo.id:0
			xy_pid = store.userinfo.is_sf==1?0:store.userinfo.id
		}
		
		return {
			title:data.value.name,
			query:`id=${data.value.id}&sf_pid=${sf_pid}&xy_pid=${xy_pid}`
		}
	})
	
	
	let data = ref()
	const getdata = async (id:number)=>{
		data.value = await workerDetail(id)
	}

</script>

<style scoped lang="scss">
	.bg{
		width: 100%;
		position: absolute;
	}
	
	.container{
		position: relative;
		z-index: 2;
	}
	
	.tag{
		background: linear-gradient( 270deg, #FFFCF4 0%, #FFF3D9 100%);
		color: #804101;
		padding: 20rpx 30rpx;
		border-radius: 0 0 20rpx 20rpx;
		.icon{
			width: 48rpx;
			height: 48rpx;
		}
		.iconfont{
			color: #FC9F00;
		}
	}
	.line{
		background: linear-gradient( 270deg, #FFFCF4 0%, #FFF3D9 100%);
		width: 100%;
		height: 20rpx;
		margin-top: -20rpx;
	}
	
	
</style>
